<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>代码生成</title>
    <link rel="stylesheet" href="/plugins/iview/css/iview.css">

</head>
<body>

<div id="app" style="margin: 5px">

    <create ref="createtem" @close="closeCreate"></create>
    <genconfig v-bind:show-genconfig="showGenconfig" @close="closeGenconfig"></genconfig>
    <div style="background: #f5f7f9; margin: 0px 30px; padding: 10px 0px;">
        <input v-model="params.name"  autocomplete="off" spellcheck="false" type="text" placeholder="表名" class="ivu-input ivu-input-default" style="width: 200px">
        <i-button type="success"  @click="search"> 搜索 </i-button>
        <i-button type="warning"  @click="showGenconfig=true"> 生成器配置 </i-button>
    </div>

    <div >
        <i-table border :columns="columns" :data="tableData" :loading="loading" style="margin-left: 30px;margin-right: 30px;"></i-table>
    </div>
    <!--<div v-if="tableData.length<=0" style="text-align: center;font-size: 20px;margin: 30px; ">暂无数据</div>-->
    <div style="text-align: center;margin: 15px;">
        <Page :total="params.totalElements" :page-size="params.size" @on-change="changePage" show-total></Page>
    </div>


</div>
<!--https://www.cnblogs.com/mophy/p/8590291.html 父调用子组件方法-->
<script src="/plugins/vue/vue.min.js"></script>
<script src="/plugins/iview/js/iview.min.js"></script>
<script src="/plugins/vue/httpVueLoader.js"></script>
<script src="/plugins/vue/axios.min.js"></script>
<script src="/app/js/i-axios.js"></script>
<script src="/app/js/utils.js"></script>

<script type="text/javascript">

    var vm = new Vue({
        el: '#app',
        components: {
            'create': httpVueLoader('create.vue'),
            'genconfig': httpVueLoader('genconfig.vue')
        },
        data:{
            showCreate: false,
            showGenconfig:false,
            genconfigDto:undefined,
            dataDto:{
                id:undefined,
                name:undefined,
                ico:undefined,
                description:undefined,
                sort:undefined,
                remark: undefined,
                pid:undefined,
            },
            columns: [
                {
                    type: 'index',
                    width:40,
                    align: 'center'
                },
                {
                    title: '表名称',
                    key: 'tableName',
                    // width:150,
                    align: 'center'
                },
                {
                    title: '创建时间',
                    key: 'createTime',
                    // width:150,
                    align: 'center'
                },
                {
                    title: '操作',
                    key: 'action',
                    align: 'center',
                    render: (h, params) => {
                        let btns = [];

                        btns.push(
                            h('Button', {
                                props: {
                                    type: 'info',
                                    size: 'small'
                                },
                                style: {
                                    marginRight: '8px'
                                },
                                on: {
                                    click: () => {
                                        this.vm.create(params.row.tableName)
                                    }
                                }
                            }, '生成代码')
                        )
                        return h('div', btns);
                    }
                }
            ],
            tableData:[],
            params:{
                name:undefined,
                page:0,
                size:10,
                totalElements:0,
            },
            editIndex:undefined,
            loading:false
        },
        mounted() {
            this.load();
        },
        methods:{
            load() {
                let _this = this;
                _this.loading=true;
                iget('/admin/generator/tables',
                    _this.params,
                    successRes => {
                        _this.tableData=successRes.content
                        _this.params.totalElements=successRes.totalElements
                        _this.loading=false;
                    },failureRes => {
                        console.info("加载数据异常",failureRes)
                    }
                )
            },
            search() {
                this.changePage(0)
            },
            changePage: function (page) {
                this.params.page = page-1;
                this.load();
            },
            closeGenconfig(show){
                this.showGenconfig=show;
            },
            closeCreate(show){
                this.showCreate=show;
            },
            create(tableName){
                console.info("index create",tableName)
                this.showCreate=true;
                this.$refs.createtem.load(tableName,this.showCreate);
            }
        }
    });
</script>

</body>
</html>